<template>
	<dd>
		<ul>
			<li v-for="pro in productList">
				<a href="product.html" class="goodsPic">
					<img v-lazy="pro.proImg" />
				</a>
				<div class="goodsInfor">
					<h2>
						<router-link :to="{path:'/pro_detail'}">{{pro.proTitle}}</router-link>
					</h2>
					<p>
						<del>{{pro.oldProPrice}}</del>
					</p>
					<p>
						<strong class="price">{{pro.proPrice}}</strong>
					</p>
					<a href="javascript:;" class="addToCart" @tap="addToCart(pro)">&#126;</a>
				</div>
			</li>
		</ul>
		<div class="loading-more">
			<p v-if="!loading || productList.length<1">已无更多了</p>
			<p v-else>正在加载...</p>
		</div>
	</dd>
</template>
<script>
	import store from "@/store/index.js";
	import data from '@/data/data.js'
	export default {
		props: ['productList', 'loading'],
		data() {
			return {
				cartList: []
			}
		},
		methods: {
			addToCart(pro) {
				let cart = JSON.parse(localStorage.getItem('cart')) || [];
				let proInfo = pro;
				let proIndex = cart.findIndex(item => item.proId == pro.proId);
				//foodIndex为-1表示不存在 ,要加入商品
				if (proIndex === -1) {
					cart.push({
						proId: pro.proId,
						proTitle: pro.proTitle,
						proCount: 1,
						proImg: pro.proImg,
						oldProPrice:pro.oldProPrice,
						proPrice: pro.proPrice
					});
				} else {
					cart[proIndex].proCount++;

				}
				this.cartList = cart;
				mui.toast('成功加入购物车')
				store.dispatch('updateAddGoodsNum', this.cartList.length);
				store.dispatch('updateCartList', this.cartList);
				localStorage.setItem('cart', JSON.stringify(this.cartList));
			},
		}
	}
</script>

<style>

</style>
